<template>
    <div style="display:flex;flex-direction:column;width:100%;margin-top:25px">
        <div style="margin-bottom:10px;background:#eee;line-height:40px;padding-left:5px">临时BOM物料分配</div>
          <div class="table-page-search-wrapper">
           <p-form  layout="inline" @keyup.enter.native="searchQuery">
            <p-row :gutter="24">
              <p-col :xl="8" :lg="7" :md="8" :sm="24">
                <p-form-item label="产品编码">
                  <p-input placeholder="请输入产品编码" disabled v-model="queryParam.mcode" @search="onSearch"></p-input>
                </p-form-item>
              </p-col>
              <p-col :xl="8" :lg="7" :md="8" :sm="24">
                <p-form-item label="产品名称">
                  <p-input placeholder="请输入产品名称" disabled v-model="queryParam.mname" @search="onSearch"></p-input>
                </p-form-item>
              </p-col>
              <p-col :xl="8" :lg="7" :md="8" :sm="24">
                <p-form-item label="产品规格">
                  <p-input placeholder="请输入产品规格" disabled v-model="queryParam.sprc" @search="onSearch"></p-input>
                </p-form-item>
              </p-col>
              <p-col :xl="8" :lg="7" :md="8" :sm="24">
                <p-form-item label="物料编码">
                  <p-input placeholder="请输入物料编码" v-model="queryParam.code" @search="onSearch"></p-input>
                </p-form-item>
              </p-col>
              <p-col :xl="8" :lg="7" :md="8" :sm="24">
                <p-form-item label="工站">
                  <p-input placeholder="请输入工站" v-model="queryParam.station" @search="onSearch"></p-input>
                </p-form-item>
              </p-col>
              <p-col :xl="8" :lg="7" :md="8" :sm="24">
                <p-form-item label="管控类型">
                  <p-input placeholder="请输入管控类型 " v-model="queryParam.billNum" @search="onSearch"></p-input>
                </p-form-item>
              </p-col>
            </p-row>
           </p-form>

          <div class="table-operator">

          <p-button  @click="search" type="primary" style="margin-left:70px">搜索</p-button>
          <p-button  @click="empty" type="primary" >清空</p-button>

      <!-- 高级查询区域 -->
        <j-super-query :fieldList="fieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query>
    </div>
          </div>
        <p-table
            ref="table"
            size="middle"
            bordered
            rowKey="id"
            :scroll='tableScroll'
            :columns="defColumns"
            :dataSource="dataSource"
            :pagination="ipagination"
            :loading="loading"
            :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
            @change="handleTableChange">

      </p-table>
    </div>
</template>
<script>
  import JSuperQuery from '@/components/jeecg/JSuperQuery.vue'
  //高级查询modal需要参数
  const superQueryFieldList=[
          {
            text:'物料编码',
            type: 'string',
            value: 'type',
          },
          {
            text:'物料名称',
            type: 'string',
            value: 'fileUrl',
          },
          {
            text:'物料类型',
            type: 'string',
            value: 'updateBy',
          },
          {
            text:'数量',
            type: 'string',
            value: 'createBy',
          },
          {
            text:'是否关键物料',
            type: 'string',
            value: 'createTime',
          },
          {
            text:'SAP管控类型',
            type: 'string',
            value: 'updateTime',
          },
          {
            text:'工站',
            type: 'string',
            value: 'remark',
          },
          {
            text: '原工站所需数量',
            value: 'action',
            type: 'string',
          },
          {
            text: '现工站所需数量',
            value: 'action',
            type: 'string',
          },
          {
            text: '退库数量',
            value: 'action',
            type: 'string',
          },
          {
            text: '物料描述',
            value: 'action',
            type: 'string',
          },
          
  ]
export default {
  components:{
    JSuperQuery,
  },
  props:{
    before:{
      type:Object
    }
  },
    data(){
        return {
          queryParam:{
            mcode:'',
            mname:'',
            sprc:'',
          },
            // 表头
        defColumns: [
          {
            title: "序号",
            dataIndex: '',
            key:'rowIndex',
            width:60,
            align: 'center',
            customRender:function (t,r,index) {
              return parseInt(index)+1;
            }
          },
          {
            title:'物料编码',
            align: 'center',
            dataIndex: 'billNum',
          },
          {
            title:'物料编码',
            align: 'center',
            dataIndex: 'billOri',
          },
          {
            title:'物料名称',
            align: 'center',
            dataIndex: 'billOriNum',
          },
          {
            title:'物料描述',
            align: 'center',
            dataIndex: 'billOriNum',
          },
          {
            title:'物料类型',
            align: 'center',
            dataIndex: 'createBy',
          },
          {
            title:'数量',
            align: 'center',
            dataIndex: 'createTime',
          },
          {
            title:'是否关键物料',
            align: 'center',
            dataIndex: 'productCodeChangeBefore',
          },
          {
            title:'SAP管控类型',
            align: 'center',
            dataIndex: 'remark',
          },,
          {
            title:'工站',
            align: 'center',
            dataIndex: 'remark',
          },,
          {
            title:'原工站所需数量',
            align: 'center',
            dataIndex: 'remark',
          },,
          {
            title:'现工站所需数量',
            align: 'center',
            dataIndex: 'remark',
          },,
          {
            title:'退库数量',
            align: 'center',
            dataIndex: 'remark',
          },
        ],
        
        /* 分页参数 */
        ipagination: {
          current: 1,
          pageSize: 10,
          pageSizeOptions: ['10', '20', '50'],
          showTotal: (total, range) => {
            return range[0] + "-" + range[1] + " 共" + total + "条"
          },
          showQuickJumper: true,
          showSizeChanger: true,
          total: 0
        }
        }
    },
    created(){
      console.log(this.before)
      if(this.before){
        this.queryParam=this.before
        this.dataSource=this.before.list
      }
      
    },
    watch:{
      before(){
        if(this.before){
        this.queryParam=this.before
        this.dataSource=this.before.list
      }
      }
    },
    methods:{
      empty(){
        this.queryParam.code=null
        this.queryParam.station=null
        this.queryParam.billNum=null
      }
    }
}
</script>